$(document).ready(function() {
	
	//switch between graph types
	$(".graphType").click(function(){
		$(".graphType.active").removeClass("active");
		$(this).addClass("active");
		if($(this).hasClass("bar")) {
			$(".barLabels").show();
		} else
			$(".barLabels").hide();
	});
	
	//test render of ini graph
	var data = [['test', 100]];
	graphOptions = {};
	var plot1 = jQuery.jqplot ('chart1', [data], graphOptions);
	
	//graph it!
	$(".go").click(function(){
		//get vars
		var errors = 0;
		var dataNames = [];
		var dataValues = [];
		var pie = ($(".graphType.active").hasClass("pie")) ? true : false;
		var bar = !pie;
		
		//test title
		var title = $(".title").val();
		if(title == "" || title == null) {
			alert("You must enter a title before completing the graph.");
			errors++;
			$(".title").parent().parent().addClass("error");
		} else {
			$(".title").parent().parent().removeClass("error");
		}
		
		//test other labels
		if(bar) {
			var xaxis = $(".xaxis").val();
			if(xaxis == "" || xaxis == null) {
				alert("You must enter an X-Axis before completing the graph.");
				errors++;
				$(".xaxis").parent().parent().addClass("error");
			} else {
				$(".xaxis").parent().parent().removeClass("error");
			}
			var yaxis = $(".yaxis").val();
			if(yaxis == "" || yaxis == null) {
				alert("You must enter an Y-Axis before completing the graph.");
				errors++;
				$(".yaxis").parent().parent().addClass("error");
			} else {
				$(".yaxis").parent().parent().removeClass("error");
			}
		}
		
		//test data rows
		//also fit data into arrays
		$(".data .dataRow").each(function(){
			var material = $(this).find(".material").val();
			var value = $(this).find(".value").val();
			//alert("material: " + material + "\nvalue: " + value);
			//errors++;
			
			var mNull = (material == null || material == "") ? true : false;
			var vNull = (value == null || value == "") ? true : false;
			
			if( (mNull && !vNull) || (!mNull && vNull) ) {
				alert("Every piece of data must have a name and a value.");
				errors++;
				$(this).addClass("error");
			} else {
				if(!mNull && !vNull) {
					dataNames.push(material);
					dataValues.push(value);
					$(this).removeClass("error");
				}
			}
			
		});
		
		//render graph
		if(errors == 0) {
			//get data
			var data = new Array();
			if(pie) {
				for (var i=0;i<dataNames.length;i++) {
					data[i] = new Array();
					data[i][0] = dataNames[i];
					data[i][1] = parseInt(dataValues[i]);
				}
			} else {
				for (var i=0;i<dataValues.length;i++) {
					data[i] = parseInt(dataValues[i]);
				}
			}
			
			//get options
			var graphOptions = {};
			if(pie) {
				graphOptions = { 
					seriesDefaults: {
						// Make this a pie chart.
						renderer: jQuery.jqplot.PieRenderer, 
						rendererOptions: {
						// Put data labels on the pie slices.
						// By default, labels show the percentage of the slice.
							showDataLabels: true
						}
					}, 
					legend: { show:true, location: 'e' },
					title: {
				        text: title,   // title for the plot,
				        show: true,
				    }
				};
			} else {
				graphOptions = { 
					seriesDefaults:{
			            renderer:$.jqplot.BarRenderer
			        },
			        axes: {
			            // Use a category axis on the x axis and use our custom ticks.
			            xaxis: {
			            	label: xaxis,
			                renderer: $.jqplot.CategoryAxisRenderer,
			                ticks: dataNames
			            },
			            yaxis: {
			            	label: yaxis
			            }
			        },
			        title: {
				        text: title,   // title for the plot,
				        show: true,
				    }
				}
			}
			
			//render
			$("#chart1").html("");
			jQuery.jqplot('chart1', [data], graphOptions);
			
			//switch displays
			$(".preGraph").addClass("hideHeight");
			$(".postGraph").removeClass("hideHeight");
		}
		
	});
	
	
	
	

			
			
});